Ext.onReady(function(){
  new Ext.FormPanel({
    renderTo: 'form-id',
    border: false,
    //frame: true,
    //title: 'Login',
    monitorValid: true,
    width: 450,
    labelAlign: 'left',   // 'right' 'left' 'top',
    bodyStyle : "background-color: transparent;",
    
    items: [{
      xtype: 'textfield',
      fieldLabel: 'Username',
      name: 'username',
      id: 'username',
      width:'300',
      anchor: '0',
      allowBlank: false
    },{
      xtype: 'textfield',
      inputType: 'password',
      fieldLabel: 'Password',
      name: 'password',
      id: 'password',
      anchor: '0',
      allowBlank: false
    }],
    
    buttons: [{
      text:'Login',
      id: 'submit-button',
      formBind: true,
      handler: function (component, event) {
        MyApp.common.removeCachedUserInfo();
        MyApp.common.handleFormSubmit(restPath + '/login/login-form-data', null, htmlPath + "/list-rows/list-rows.html")(component, event);
      }
    }],

//    listeners: {
//      afterlayout: function(){
//        this.getForm().findField("username").focus();
//      }
//    },
  
    defaults: MyApp.common.submitWithEnterFormFieldDefault("submit-button")
  });
});